<template>
<el-dialog :model-value="visible" title="登录账号">
    <el-form :model="form">
        <el-form-item label="邮箱" :label-width="label_width">
            <el-input v-model="form.e_mail" autocomplete="off"/>
        </el-form-item>
        <el-form-item label="密码" :label-width="label_width">
            <el-input type="password" v-model="form.passwd" autocomplete="off"/>
        </el-form-item>
        <el-radio-group v-model="form.type">
            <el-radio label=1 size="large">我是病人</el-radio>
            <el-radio label=2 size="large">我是医生</el-radio>
        </el-radio-group>
        <el-form-item>
            <el-button
                style="margin: auto"
                type="primary"
                @click="login">
                登录
            </el-button>
        </el-form-item>
        <el-form-item>
            <el-button
                style="margin: auto"
                type="primary"
                text
                @click="turn2Register">
                没有账号？现在注册
            </el-button>
        </el-form-item>
    </el-form>
</el-dialog>
</template>

<script>

import {ElMessage} from "element-plus";
import axios from 'axios';

export default {
    name: "LoginPage",
    props: ['visible'],
    data() {
        return {
            label_width: '80px',
            form: {
                e_mail: '',
                passwd: '',
                type: 0
            }
        }
    },
    methods: {
        turn2Register: function () {
            this.$emit('turn_2_register')
        },
        login: function () {
            let loginForm = {
                email: this.form.e_mail,
                password: this.form.passwd
            }
            const _this = this;
            axios.post(process.env.VUE_APP_BASEURL + "user/login", loginForm).then(function (resp) {
                if (resp.data.code === 0) {
                    _this.form.type = resp.data.data
                    _this.loginSuccess(resp.data.msg)
                } else {
                    _this.loginFailure(resp.data.msg)
                }
            })
        },
        loginSuccess: function (message) {
            this.$emit('login_success', this.form.e_mail, this.form.type)
            ElMessage({
                message: message,
                type: 'success'
            })
        },
        loginFailure: function (message) {
            ElMessage({
                message: message,
                type: 'error'
            })
        }
    }
}


</script>

<style scoped>

</style>